<template>
<div
    class="iframe-main"
    v-loading="state.loading"
>
    <iframe
        :src="state.iframeSrc"
        frameborder="0"
        height="100%"
        width="100%"
        id="iframe"
        ref="iframeRef"
        @load="hideLoading"
        sandbox="allow-same-origin allow-scripts allow-popups allow-forms"
    >
    </iframe>
</div>
</template>

<script setup lang="ts">
import { reactive } from 'vue'
import { useRouter } from 'vue-router'

const router = useRouter()

const u = router.currentRoute.value.query.u as string

const state = reactive({
    loading: true,
    iframeSrc: atob(u),
})

//console.log(state.iframeSrc)

const hideLoading = () => {
    state.loading = false
}
</script>

<style scoped lang="scss">
.iframe-main {
    //margin-left: 15px;
    iframe {
        height: 100vh;
    }
}
</style>
